import 'package:demo/page.dart';
import 'package:flutter/material.dart';

class MainTabBar extends StatefulWidget {
  MainTabBar({Key key}) : super(key: key);

  @override
  _MainTabBarState createState() => _MainTabBarState();
}

class _MainTabBarState extends State<MainTabBar> {
  
  int seleted = 0;
  List pages = [Page("首页"),Page("搜索"),Page("消息"),Page("我的")];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: pages[seleted],
      bottomNavigationBar: BottomAppBar(
        color: Colors.white,
        shape: CircularNotchedRectangle(),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          mainAxisSize: MainAxisSize.max,
          children: <Widget>[
            _bottomItem(0, '首页', Icons.home),
            _bottomItem(1, '搜索', Icons.search),
            _bottomItem(-1, '', Icons.search),
            _bottomItem(2, '消息', Icons.email),
            _bottomItem(3, '我的', Icons.person),
          ],          
        ),
      ), 
      floatingActionButton: FloatingActionButton(
        onPressed: (){
          Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext context){
            return Page("pop");
          }));
        },
        child: Icon(Icons.add,color: Colors.white,),
        
      ),    
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
    );
  }

  Widget _bottomItem(int index ,String title,IconData iconData){

    Color normalColor = Colors.grey;
    Color seletedColor = Colors.lightBlue;

    return Expanded(
      child: SizedBox(
        height: 50,
        child: Padding(
          padding: EdgeInsets.only(top:6),
          child: GestureDetector(
            child: Column(
              children: <Widget>[
                Icon(iconData,color: index==seleted?seletedColor:normalColor,),
                Text(title,style: TextStyle(color: index==seleted?seletedColor:normalColor),)
              ],
            ),
            onTap: (){
              if(index == -1) return;
              setState(() {
                seleted = index;
              });
            },
          ),
        ),
      ),
    );
  }
}